<template>
    <div>
        <div class="title">周末去哪儿</div>
        <div class="list">
            <ul>
                <li v-for="(item,index) in list" :key="index">
                    <div class="pic_box">
                        <img :src="item.imgUrl" />
                    </div>
                    <div class="cont">
                        <div class="tit">{{item.title}}</div>
                        <div class="desc">{{item.desc}}</div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        props:['list'],
        name:'homeweekend',
        data(){
            return{
            }
        }
    }
</script>

<style scoped lang="stylus">
    .title
        margin-top  0.2rem
        font-size   0.34rem
        line-height 0.8rem
        background  #eee
        padding 0 0.2rem
        font-weight bold
        margin  0.3rem 0
    .list ul li
        width   7.1rem
        margin-left auto
        margin-right    auto
        box-sizing  border-box
        .pic_box
            width   100%
            height  2.7rem
            overflow    hidden
            img
                width   100%
                height  auto
        .cont
            padding 0.3rem 0.2rem
            .tit
                font-size   0.32rem
                line-height 0.5rem
                color   #333
                overflow    hidden
                text-overflow   ellipsis
                white-space nowrap
            .desc
                font-size   0.26rem
                line-height 0.4rem
                color   #999
                overflow    hidden
                text-overflow   ellipsis
                white-space nowrap
</style>